<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
            Add info film
            <small class="label label-warning"> You can add a film to your site</small>
          </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">request</li>
    </ol>
</section>
<section class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-info">
                <div class="box-body">
                    <form>
                        <div class="row">
                            <div class="col-md-8">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Title Film *:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-pencil text-aqua"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Enter film's title, it is important">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputPassword1">Title 2:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-pencil text-yellow"></i></span>
                                            <input type="text" class="form-control" id="exampleInputPassword1" placeholder="Enter film's title, it isn't important">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputPassword1">Key Word in tag:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-pencil text-yellow"></i></span>
                                            <input type="text" class="form-control" id="exampleInputPassword1" placeholder="about 6 word">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputPassword1">Key Word for search:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-pencil text-yellow"></i></span>
                                            <input type="text" class="form-control" id="exampleInputPassword1" placeholder="about 6 word">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputPassword1">Dscription in tag:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-pencil text-yellow"></i></span>
                                            <textarea class="form-control" rows="4" placeholder="Dscription your film, maximum 220 words"></textarea>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Director:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="ion ion-person text-aqua"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Actor:</label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="ion ion-person text-aqua"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Option Film*: </label>
                                        <select class="form-control">
                                            <option>Movie</option>
                                            <option>OVA</option>
                                            <option>Cartoon</option>
                                            <option>Full episode</option>
                                            <option>unFull episode</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Country*: </label>
                                        <select class="form-control">
                                            <option>VietNam</option>
                                            <option>Japan</option>
                                            <option>US</option>
                                            <option>China</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Duration: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Duration: 18 or Full...">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Quality: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-hd-video"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="FullHD,HD or SD">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Release year: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon text-aqua"><i class="fa fa-clock-o"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="the year is showed of film, 2005, 2013...">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Release date: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-info-sign text-aqua"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Release date: 26/2/2018">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="box box-success">
                                    <div class="box-header with-border">
                                        <h3 class="box-title">Category</h3>
                                    </div>
                                    <div class="box-body">
                                        <ul class="list-add">
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                            <li>
                                              <input tabindex="5" type="checkbox" id="minimal-checkbox-1 col-md-2">
                                              <label for="minimal-checkbox-1 col-md-10">Checkbox 1</label>
                                            </li>
                                        </ul>
                                    </div>
                                </div><!-- end list category-->
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Thumbnail: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-picture"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Your URL image thumb">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="exampleInputName2">Big image: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-picture"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Your URL of image big">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="exampleInputName2">URL Trailer: </label>
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="fa fa-play-circle-o text-light-blue"></i></span>
                                            <input type="text" class="form-control" id="exampleInputName2" placeholder="Your link facebook">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-12">
                                <!-- textarea -->
                                <div class='box box-info'>
                                    <div class='box-header'>
                                        <!-- tools box -->
                                        <div class="box-header with-border">
                                            <h3 class="box-title">Content Film</h3>
                                            <div class="box-tools pull-right">
                                                <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                                                <button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                                            </div>
                                        </div>
                                        <!-- /. tools -->
                                    </div>
                                    <!-- /.box-header -->
                                    <div class='box-body pad'>
                                        <form>
                                            <textarea id="editor1" name="editor1" rows="10" cols="80">
                                                This is my textarea to be replaced with CKEditor.
                                            </textarea>
                                        </form>
                                    </div>
                                </div>
                                <!-- /.box -->
                            </div>
                        </div>
                        <div class="box-footer pull-right">
                            <button type="button" class="btn btn-success"><i class="glyphicon glyphicon-floppy-disk"></i>  SAVE</button>
                            <button type="button" class="btn btn-danger"><i class="glyphicon glyphicon-trash"></i>  Delete </button>
                        </div>
                    </form>
                </div>
            </div><!-- /.box-body -->
        </div>
    </div>
</section>
<script>
	jQuery(document).ready(function($) {
        $('input[type="checkbox"]').iCheck({
          checkboxClass: 'icheckbox_flat-blue',
          radioClass: 'iradio_flat-blue'
        });
	});
    $(function () {
        // Replace the <textarea id="editor1"> with a CKEditor
        // instance, using default configuration.
        CKEDITOR.replace('editor1');
        //bootstrap WYSIHTML5 - text editor
        $(".textarea").wysihtml5();
    });
</script>